<template>
  <div>
    <el-table
      v-loading="tableLoading"
      :data="damageNoticeTable"
      :default-sort="{prop: 'generatedDate', order: 'descending'}"
    >
      <el-table-column label="通知号" align="center">
        <template slot-scope="{row}">
          <span>{{ row.damageNoticeID }}</span>
        </template>
      </el-table-column>
      <el-table-column sortable prop="generatedDate" label="通知时间" align="center">
        <template slot-scope="{row}">
          <span>{{ toDateString(row.noticeDate) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="设施名" align="center">
        <template slot-scope="{row}">
          <span>{{ row.facilityName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="损坏部位" align="center">
        <template slot-scope="{row}">
          <span>{{ row.damagePart }}</span>
        </template>
      </el-table-column>
      <el-table-column label="损坏原因" align="center">
        <template slot-scope="{row}">
          <span>{{ row.damageReason }}</span>
        </template>
      </el-table-column>
      <el-table-column label="审核意见" align="center">
        <template slot-scope="{row}">
          <span>{{ row.auditOpinion }}</span>
        </template>
      </el-table-column>
      <el-table-column label="整修状态" align="center">
        <template slot-scope="{row}">
          <el-tag :type="getTagColor(row.renovateDetailID)">{{ convertStatus(row.renovateDetailID) }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column min-width="120" fixed="right" label="操作" align="center">
        <template slot-scope="{row}">
          <span />
          <RenovateEnrollFrom
            :data="{technicianID: '',remarks: '',damageNoticeID: row.damageNoticeID,renovateDetailID: row.renovateDetailID}"
            @submitSuccess="refresh"
          />
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { searchDamageNotice } from '@/api/dailyInspection'
import { mapGetters } from 'vuex'
import { toDateString } from '@/utils/time-handle'
import RenovateEnrollFrom from '@/views/daily-inspection/components/RenovateEnrollForm'

export default {
  name: 'RenovateEnroll',
  components: { RenovateEnrollFrom },
  data() {
    return {
      tableLoading: true,
      damageNoticeTable: [],
      dialogVisible: false,
      allTechnician: []
    }
  },
  computed: {
    ...mapGetters([
      'departmentId',
      'superDepartmentId',
      'roles'
    ])
  },
  created() {
    this.getAllDamageNotice()
  },
  methods: {
    toDateString,
    getAllDamageNotice() {
      const params = {
        departmentId: this.superDepartmentId,
        renovateEnroll: true
      }
      searchDamageNotice(params).then(data => {
        this.damageNoticeTable = data
        this.tableLoading = false
        this.$message.success('已刷新整修通知记录')
      })
    },
    refresh() {
      this.getAllDamageNotice()
    },
    getTagColor(id) {
      return id ? 'success' : 'danger'
    },
    convertStatus(id) {
      return id ? '已整修' : '未整修'
    }
  }
}
</script>

<style scoped>

</style>
